@import controllers.Ext 
@import play.api.i18n._
@scripts = {
	<script src="@routes.Assets.at("javascripts/jquery-ui-1.10.0.custom/js/jquery-ui-1.10.0.custom.js")" type="text/javascript"></script>
} 
@stylesheets = {
	<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/draganddrop.css")@Ext.vi()"/>
	<link rel="stylesheet" media="screen" href="@routes.Assets.at("javascripts/jquery-ui-1.10.0.custom/css/smoothness/jquery-ui-1.10.0.custom.css")"/>
} 
@title = {
	@Messages("mission_title")
}

@main(title, scripts, stylesheets) {
<script type="text/javascript">
$(document).ready(function(){
	if (localStorage["position-left"] != null){
		$('#makeMeDraggable').css('left',localStorage["position-left"] +'px');
	}
	
	if (localStorage["position-top"] != null){
		$('#makeMeDraggable').css('top',localStorage["position-top"] +'px');
	}
	
	if (localStorage["size-width"] != null){
		$('#makeMeDraggable').css('width',localStorage["size-width"]);
	}
	
	if (localStorage["size-height"] != null){
		$('#makeMeDraggable').css('height',localStorage["size-height"]);
	}
	
	$('#makeMeDraggable').resizable({
		stop: function(event, ui){
			localStorage['size-width'] = ui.size.width;
			localStorage['size-height'] = ui.size.height;
			
		}
	}).draggable({
		stop: function(event,ui){
			localStorage["position-left"] = ui.position.left;
			localStorage["position-top"] = ui.position.top;
		}
	});
});
</script>

	<div id="makeMeDraggable"> </div>
}
